<!--
 * @description:  
 * @author: sleep
 * @Date: 2019-08-22 19:41:20
 * @LastEditors: zhaoqiang zhaoqiang@qq.com
 * @LastEditTime: 2024-01-28 20:45:09
-->
<template>
	<view class="contina">
		<view class="top">
			<view class="navTop"></view>
			<view class="w">
				<view v-if="isLogin" class="flex_a_c" style="margin-top: 30rpx;" @click="changeCompany">
					<view class="tips_2">
						{{data.corp.name}}
					</view>
					<view class="tips_2_img">
						<image src="../../static/image/company.png" style=""></image>
					</view>
				</view>
				<view class="tips_1" v-else>
					您还未登录，快来一键登录吧
				</view>
				<view style="margin-top: 48rpx;display: flex;justify-content: space-between;" @click="sysClk">
					<view class="tipMsg">
						<view class="title">
							系统提醒
						</view>
						<view class="msg">
							{{isLogin?'云阔通建助您科学管理您的企业':'立即登录 开启您的企业管理之旅'}}
						</view>
					</view>
					<image style="width: 115rpx;height: 160rpx;" src="../../static/image/robot.png"></image>
				</view>
			</view>
			<view class="w">
				<view class="board">
					<view class="t">
						<view class="top">
							<view class="flex_a_c title">
								<view class="icon">
									<image style="width: 32rpx;height: 32rpx;" src="../../static/image/money.png">
									</image>
								</view>
								<view class="text">
									{{data.year}}年项目总造价金额(元)
								</view>
							</view>
							<view class="price">
								<text style="font-size: 24rpx;">¥</text> {{data.project_price.toFixed(2)}}
							</view>
						</view>
						<view class="bot">
							<image src="../../static/image/total.png" style="height: 100%;width: 100%;"></image>
						</view>
					</view>
					<view class="b flex_a_c">
						<view class="item">
							<view class="tit">
								项目(个)
							</view>
							<view class="num">
								{{data.project_num}}
							</view>
						</view>
						<view class="item">
							<view class="tit">
								投标(个)
							</view>
							<view class="num">
								{{data.bidding_num}}
							</view>
						</view>
						<view class="item">
							<view class="tit">
								人才(人)
							</view>
							<view class="num">
								{{data.staff_num}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="w" style="padding-bottom: 30px;">
			<cardCom title="项目状态" :type="1" :data="data.project_list"></cardCom>
			<cardCom title="投标状态" :type="2" :data="data.bidding_list"></cardCom>
			<cardCom title="业绩" :type="3" :data="data.performance_list"></cardCom>
		</view>
	</view>
</template>

<script>
import cardCom from "@/compoment/cardCom.vue"
export default {
	data() {
		return {
			isLogin: false,
			data:{
				"corp": [],
				"project_price": 0,
				"project_num": 0,
				"bidding_num": 0,
				"staff_num": 0,
				"project_list": [],
				"bidding_list": [],
				"performance_list": [],
				"year": []
			}
		}
	},
	components: {
		cardCom
	},
	onShow() {
		this.isLogin = this.$fun.getToken()?true:false;
		this.getData(),
		uni.$on('select_corp',(data)=>{
			this.data.corp = data
		})
	},
	methods: {
		async getData() {
			this.data = await this.$api.homeApi.data()
		},
		changeCompany() {
			uni.navigateTo({
				url:'/pages/changeComp/changeComp?corp_id='+this.data.corp.id
			})
		},
		sysClk(){
			uni.navigateTo({
				url:"/pages/sysNotice/sysNotice"
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.contina {
	.top {
		width: 100%;
		background-image: linear-gradient(#1676FE, #F4F9FF);

		.tips_1 {
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
		}

		.tips_2 {
			width: 60%;
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			// 超出省略号
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}

		.tips_2_img {
			width: 62rpx;
			height: 62rpx;
			border-radius: 50%;
			background-color: #CCDEFC;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 60%;
				height: 65%;
			}
		}

		.tipMsg {
			width: 564rpx;
			height: 130rpx;
			box-sizing: border-box;
			background-color: #fff;
			padding: 20rpx;
			border-radius: 5px 5px 5px 5px;
			position: relative;

			.title {
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #0074FF;
			}

			.msg {
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #3D3D3D;
				margin-top: 10rpx;
			}
		}

		.tipMsg::after {
			content: ' ';
			display: block;
			width: 0;
			height: 0;
			border-width: 10px;
			border-style: solid;
			border-top-color: transparent;
			border-right-color: transparent;
			border-bottom-color: transparent;
			border-left-color: #fff;
			position: absolute;
			top: 23rpx;
			right: -37rpx;
		}

		.board {
			box-sizing: border-box;
			border-radius: 16rpx;
			background-color: #FEFEFF;

			.t {
				display: flex;
				padding: 30rpx;
				background-color: #fff;
				border-radius: 16rpx 16rpx 0 0;
				box-shadow: 0px 2px 5px 0px #F5F7FC;

				.top {
					width: 412rpx;
					height: 48rpx;
					line-height: 48rpx;
					background: #F3F7FE;
					border-radius: 6rpx;
					background-color: #F3F7FE;
					font-size: 24rpx;

					.title {
						box-shadow: 1px 2px 5px 3px #E7F1FC;
						box-sizing: border-box;

						.icon {
							width: 48rpx;
							height: 48rpx;
							background-color: #fff;
							border-radius: 6rpx;
							text-align: center;
							box-shadow: 1px 2px 5px 2px #E7F1FC;
							display: flex;
							justify-content: center;
							align-items: center;
						}

						.text {
							// width: calc(100% - 48rpx);
							color: #0074FF;
							margin-left: 20rpx;
						}
					}

					.price {
						font-size: 48rpx;
						font-weight: 400;
						color: #333333;
						margin-top: 80rpx;
					}
				}

				.bot {
					width: 160rpx;
					height: 175rpx;
					margin-top: 20rpx;
					margin-left: 34rpx;
				}
			}

			.b {
				padding: 30rpx;
				border-radius: 0 0 16rpx 16rpx;

				.item {
					box-sizing: border-box;
					flex: 1;
					padding-left: 50rpx;
					border-right: #E5E5E5 solid 1px;

					.tit {
						font-size: 24rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						color: #9CA3B4;
					}

					.num {
						margin-top: 10rpx;
						font-size: 28rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						color: #000000;
					}
				}

				.item:last-child {
					border: none;
				}
			}
		}
	}
}
</style>
